.mask {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0;
  background-color: rgba($color: #000000, $alpha: 0.4);
  z-index: 999;
  display: flex;
  justify-content: center;

  &.top {
    align-items: flex-start;
  }

  &.botton {
    align-items: flex-end;
  }

  &.center {
    align-items: center;
    

    .content {
      // transform: 0 !important;
      transform: translate(0)
    }
  }

  .content {
    // background-color: red;
    transform: translateY(30vh);
    /* 初始位置在屏幕之外 */
    transition: transform 0.3s ease-in-out;
    width: 100%;
  }
}